<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自在天原</title>
    <script src="../js/main.js"></script>
    <script src="../js/controller.js"></script>
    <script src="../js/angular-route.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/checkBox.css">
    <script src="../js/chatController.js"></script>

    <!--<link rel="stylesheet" type="text/css"-->
    <!--href="http://zizai.pro/zzlp/resources/Bootstrap/css/base308288.css">-->
</head>
<script>
    $("body").click(function (e) {
        if ( ! ($(e.target).closest("#xLayer1").length || $(e.target).closest("#checkDiv").length) ) {

            $("#checkDiv").hide();
        }
        if ( ! ($(e.target).closest("#Layer12").length || $(e.target).closest("#emoji").length) ) {
            $("#emoji").hide();
        }
    })

</script>
<body ng-app="app" ng-controller="chatController">
<div id="Layer29">
    <!--二级div-->
    <div id="Layer27">
        <div id="Layer3">
            <div id="Layer10">
                <input class="search" placeholder="search user..." ng-model="test">

            </div>
            <!--<div id="Layer11"><input type="image" src="/zzlp/img/111.png" width="25" height="25"></div>-->
            <div id="Layer11"></div>
            <div id="xLayer1"><img src="/zzlp/img/+++.png" width="25" height="25" ng-click="showCheckDiv()"></div>
        </div>
        <div class="Layer4" >
            <div class="Layer22" id="{{user.userId}}div" ng-repeat="user in users | filter:{'name':test}" ng-click="openChatBox(user.userId,user.name,$event)">
                <div id="Layer23" ><img  class="smallAvatar" src="{{user.photo}}"/></div>
                <div style="display: none" class="userId">{{user.userId}}</div>
                <span class="redpoint" id="{{user.userId}}red" style="display:{{user.redState}}">{{user.red}}</span>
                <div class="STYLE2" id="Layer24">{{user.name }}</div>
                <div class="LayerCont" id="{{user.userId}}LastMessage">
                    {{user.lastMessage|cut:true:10:'..'}}
                </div>
            </div>
            <div class="Layer22"   ng-repeat="groupInfo in groupInfos | filter:{'name':test}" id="{{groupInfo.id}}div" ng-click="openChatBox(groupInfo.id,groupInfo.name)">
                <div id="xLayer23"><img  class="smallAvatar" src="{{groupAvaSrc}}"/></div>
                <span class="redpoint" style="display:{{groupInfo.redState}}" id="{{groupInfo.id}}count">{{groupInfo.unReadMsgCount}}</span>
                <div class="STYLE2" id="xLayer24">{{groupInfo.name}}</div>
                <div class="LayerCont" id="{{groupInfo.id}}LastMessage" >
                    {{groupInfo.lastMsg|cut:true:10:'..'}}
                </div>
            </div>
        </div>
        <div id="checkDiv" hidden>
            <div id="xLayer2" >
                <div ng-repeat="user in users">
                    <div class="checkboxFour"><input type="checkbox" id="{{user.userId}}checked"><label for="{{user.userId}}checked"></label><span class="xSTYLE2">{{user.name}}</span></div>
                </div>
            </div>
            <div id="xLayer4" >
                <button ng-click="buildGroup()" >创建</button>
            </div>
        </div>
    </div>
    <!--二级div结束-->


    <!--三级div-->
    <div class="Layer28" id="coverDiv"></div>
    <div id="Layer28">
        <div id="emoji" >
            <div class="tempEmoji">
                <div class="smallemoji" ng-repeat="emoji in emojis"><p ng-click="addEmojiToChatBox(emoji)">{{emoji}}</p>
                </div>
            </div>
        </div>
        <div class="input" contenteditable placeholder="请输入文字"><!--输入框-->

        </div>

        <!--聊天标题-->
        <div class="Layer9"><span class="name" id="targetName"></span>
            <div style="display: none" id="targetId"></div>
            <div style="display: none" id="tempChatView"></div>
        </div>
        <!--聊天框-->
        <div class="Layer7"  id="chatView">

        </div>
        <!--表情-->
        <div id="Layer6">

            <div id="Layer12" >
                <img src="/zzlp/img/5.png" alt="表情" ng-click="addEmoji()"/>


            </div>
            <div id="Layer13" >
                <!--<input class="webuploader-element-invisible" type="file">-->
                <img src="/zzlp/img/6.png" alt="文件" ng-click="selectFile()"/>
                <input type="file" id="file" onchange="angular.element(this).scope().change()" ng-model="file"
                       name="files"
                       style="filter:alpha(opacity=0);opacity:0;width: 0;height: 0;"/>
                <!--<input type="file" id="file"-->
                <!--/>-->
                <br>

            </div>
            <div class="chatLog" >
                <img src="/zzlp/img/download.png" alt="记录" ng-click="createLog()"/>
            </div>
        </div>
        <!--输入框-->
        <div class="input" contenteditable placeholder="请输入文字" ng-bind-html="msg"
             id="chatBox">

        </div>

        <!--发送-->
        <div id="Layer5">
            <button type="button" align="center" class="btn btn-default btn-sm right" id="sendMsg"  ng-click="sendMsg()">发送</button>
            <span class="right1">Enter直接发送&nbsp;&nbsp;</span>
        </div>

    </div>
    <!--三级div结束-->
    <div id="js-imgview-mask" class="imgview-mask" style="display: none;" ng-click="closePic()">
    </div>
    <div id="js-imgview" class="show-img">
        <img id="bigimage">
        <a ng-click="closePic()">X</a>
    </div>

</div>
</body>
</html>
